<template>
	<view class="index">
		<!-- 轮播 -->
		<view class="shuttle">
			<uni-swiper-dot :info="bannerList" :current="bannerCurrent" mode="round" :dotsStyles="dotsStyles">
				<swiper class="shuttle_swiper" :autoplay="true" :interval="3000" :circular="true"
					@change="swiperChange">
					<swiper-item class="shuttle_swiper" v-for="(item, index) in bannerList" :key="index">
						<image @click="goNext('/pagesA/info/newsinfo?type=universal&id='+item.id, false)"
							class="shuttle_img" :src="http_img+item"></image>
					</swiper-item>
				</swiper>
			</uni-swiper-dot>
		</view>
		<!-- 信息 -->
		<view class="index_info flex-row-between">
			<view class="info_L flex-column-center flex-start">
				<view class="font14 font-323232 font-b">{{conobj.physical_h_name}}</view>
				<view class="font13 font-969696">{{conobj.physical_h_addr}}</view>
			</view>
			<view class="info_R flex-column-center" @click="Onphone">
				<view class="font12 font-969696">电话</view>
				<image src="@/static/info/phone.png"></image>
			</view>
		</view>
		<!-- 边框 -->
		<view class="com_border"></view>
		<!-- 切换 -->
		<view class="index_head">
			<view v-for="(item,index) in headlist" :key="index" class="head_bos" @click="Onhead(item)">
				<text :class="headindex == item.id?'head_titlea':'head_titleb'">{{item.name}}</text>
				<view v-if="headindex == item.id"></view>
			</view>
		</view>
		<!-- 数据 -->
		<view class="index_data">
			<view v-for="(item,index) in dataList" :key="index" class="data_list" @click="Oninfo(item)">
				<image class="data_image" :src="http_img+item.img" mode=""></image>
				<view class="data_bos flex-column-center flex-start">
					<view class="data_title font14 font-323232 font-b ellipsis">{{item.name}}</view>
					<view class="font13 font-646464 font-b">￥{{item.price}}</view>
					<!-- <view class="data_info"> -->
						<view class="data_info font-ffffff font12">2项已优惠50</view>
					<!-- </view> -->
				</view>

			</view>
		</view>
		<view v-if="!loadShow" class="w100 tc font14 font-969696">我也是有底线的~</view>

	</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				conobj:{},
				bannerList: [],
				//轮播参数
				bannerCurrent: 0,
				dotsStyles: {
					width: 3,
					height: 3,
					backgroundColor: 'rgba(51, 51, 51, .3)',
					border: '1px rgba(51, 51, 51, .3) solid',
					selectedBackgroundColor: '#6bcbb6',
					selectedBorder: '1px #6bcbb6 solid'
				},
				headindex: '',
				headlist: [],
				dataList: [],
				httpobj: {
					page: 1,
					limit: 10,
					category_id: ''
				},
				loadShow: false,
				http_img: ''
			}
		},
		onLoad() {
			this.http_img = this.$store.state.http_img
			//体检分类
			this.OnCategory()
			//公共接口
			this.Onconfig()
		},
		onReachBottom() {
			if (this.goodshow) {
				this.httpobj.page++
				this.OnList()
			}
		},
		methods: {
			Onconfig() {
				this.$Http({
					url: 'consultationConsult',
					data: {}
				}).then(res => {
					if (res.code == 1) {
						this.bannerList = res.data.physical_h_img
						this.conobj = res.data
					}
				})
			},
			//体检分类
			OnCategory() {
				this.$Http({
					url: 'physicalCategory',
					data: {},
					token: false
				}).then(res => {
					if (res.code == 1) {
						let obj = {
							id: '',
							name: '全部'
						}
						res.data.unshift(obj)
						this.headlist = res.data
						this.headindex = ''
						//获取体检项目
						this.OnList()
					}
				});
			},
			//获取体检项目
			OnList() {
				this.$Http({
					url: 'physicalList',
					data: this.httpobj,
					token: false
				}).then(res => {
					if (res.code == 1) {
						this.dataList = this.dataList.concat(res.data.data)
						if (res.data.data.length == 0 || this.httpobj.page >= res.data.all_page) {
							this.goodshow = false
						} else {
							this.goodshow = true
						}
					}
				});
			},
			//切换
			Onhead(res) {
				this.headindex = res.id
				this.httpobj.page = 1
				this.httpobj.category_id = res.id
				this.dataList = []
				this.OnList()
			},
			//详情页面
			Oninfo(e) {
				uni.navigateTo({
					url: '/pagesA/check/info/info?id='+e.id,
				})
			},
			//拨打电话
			Onphone(e){
				uni.makePhoneCall({
				    phoneNumber: this.conobj.physical_h_tel //仅为示例
				});
			}
		}
	}
</script>

<style lang="less">
	@import url("index.less");
</style>
